<style lang="stylus" type="text/stylus">
  @import 'css/other-edit-con.styl'

</style>

<template>
  <div id="block">
    <div class="edit-header">
      <span @click="goBack()" class="route-title">{{getRouteQuery.pageName}}</span>
      <span class="page-name">&nbsp;/&nbsp;查看申请：{{applyData.companyName}}</span>
    </div>
    <div id="edit-con">
      <div class="edit-component-left">
        <div class="componentLeft-title">
          申报概要
        </div>
        <VuePerfectScrollbar ref="componentConL" class="edit-con-l">
          <ul>
            <li v-for="(item,itemIndex) in applyData.attachments">
              <div class="componentInfo">
                <div class="componentInfoTitle">{{item.description}}</div>
                <div class="componentInfoContent" v-if="item.filename">
                  <i class="ivu-icon ivu-icon-document-text"></i>
                  <a :href="item.url" target="_blank">{{item.filename}}</a>
                </div>
                <div class="componentInfoContent" v-else>
                  <p>未上传文件</p>
                </div>
              </div>
            </li>
          </ul>
        </VuePerfectScrollbar>
      </div>
      <!-- <div class="edit-con-r">
        <div class="edit-con-r-title">查看申请</div>
        <VuePerfectScrollbar ref="componentConR" class="edit-con-r-ps">
          <componentDetail :componentData="componentDetailData"></componentDetail>
        </VuePerfectScrollbar>
      </div> -->
      <div class="edit-component">
        <div class="edit-component-title">操作</div>
        <VuePerfectScrollbar ref="componentConEdit" class="edit-component-ps">
          <otherEditComponent @goBack="goBack" @componentConEditPs="componentConEditPs"
                         v-if="applyData.id"
                         :block="getRouteQuery"
                         :editComponentData="applyData"></otherEditComponent>
        </VuePerfectScrollbar>
      </div>
    </div>
  </div>
</template>
<script type="text/ecmascript-6">
  import otherEditComponent from './otherEditComponent.vue'

  export default {
    name      : 'Component',
    data() {
      return {
        parentfunObj     : {},
        componentID      : '',
        applyData        : {},
        editComponentData: {}
      }
    },
    components: {
      otherEditComponent
    },
    computed  : {
      getApplyId() {
        return this.getRouteQuery.id
      },
      getRouteQuery() {
        return this.$route.query
      },
      getComponentURL() {
        let url = this.$store.getters.getComponentHistory
        return url[url.length - 1]
      },
      componentDetailData() {
        if (this.parentfunObj.id == undefined) {
          return []
        }
        this.ajaxData({
          url  : this.getComponentURL,
          urlv2: 'v2',
          type : 'get',
          data : {
            applyId    : this.getApplyId,
            componentId: this.parentfunObj.id
          }
        }, (res, all) => {
          if (all.code == 0) {
            this.$store.commit('changeGroupData', res);
            setTimeout(() => {
              this.$refs.componentConR.update();
            }, 10)

            return res
          }
        })
      }
    },
    methods   : {
      goBack() {
        this.$router.push({
          name : this.getRouteQuery.name,
          query: {
            policyId : this.applyData.policyId,
            scrolltop: this.getRouteQuery.scrolltop,
            tapChks  : this.getRouteQuery.tapChks,
            navChks  : this.getRouteQuery.navChks
          },
        })
      },

      getData(action) {
        this.ajaxData({
          type : 'get',
          urlv2: 'v2',
          url  : `/sepcialApply/get`,
          data : {
            applyId: this.getApplyId
          }
        }, (res, all) => {
          if (all.code == 0) {
            this.applyData = res
            this.$refs.componentConEdit.update();
            !action ? this.parentfun(res.catalogs[0].components[0]) : ''
          }
        })
      },

      listLeve(num) {
        return 'list-' + num
      },
      parentfun(obj) {
        this.parentfunObj = obj;
        this.componentID  = obj.id;
      },
      componentConEditPs() {
        this.getData('componentConEditPs')
      }
    },
    created() {
      let url = `/component`;
      this.$store.commit('resetComponentHistory', url)
      this.getData()
    }
  }
</script>
